<template>
    <div class="option">
      <el-tabs type="border-card" v-model="state.activeName" @tab-change="onTabChange">
        <el-tab-pane label="A4" name="A4">
          <OptionTable :activeName="state.activeName" />
        </el-tab-pane>
        <el-tab-pane label="A3" name="A3"><OptionTable :activeName="state.activeName" /></el-tab-pane>
        <el-tab-pane label="B5" name="B5">
          <OptionTable :activeName="state.activeName" />
        </el-tab-pane>
        <el-tab-pane label="皮纹纸颜色" name="皮纹纸颜色">
          <ColorTag />
        </el-tab-pane>
      </el-tabs>
    </div>
  </template>
  
  <script setup>
  import OptionTable from './OptionTable.vue'
  import ColorTag from './ColorTag.vue'
  const state = reactive({
    activeName: 'A4'
  })
  const onTabChange = (tab) => {}
  onMounted(() => {})
  </script>
  
  <style lang="scss" scoped>
  .option {
    padding: 16px 0;
  }
  </style>
  